From ff20abda8ee1aa78e9ee82bca02e3e1093183983 Mon Sep 17 00:00:00 2001 From: Jakub Steiner Date: Wed, 17 Jun 2015 13:05:02 +0200 Subject: [PATCH] HC: touch text selection styling - sync with Adwaita - try to avoid using image assets https://bugzilla.gnome.org/show_bug.cgi?id=750883 --- gtk/theme/HighContrast/_common.scss | 86 +++++++++++-- gtk/theme/HighContrast/gtk.css | 188 ++++++++++++++++++++++++++-- 2 files changed, 258 insertions(+), 16 deletions(-) diff --git a/gtk/theme/HighContrast/_common.scss b/gtk/theme/HighContrast/_common.scss index 5cd70bdf33..a5e86d0a6f 100644 --- a/gtk/theme/HighContrast/_common.scss +++ b/gtk/theme/HighContrast/_common.scss @@ -1105,14 +1105,6 @@ GtkTreeView.view.progressbar { //Progressbar in treeview cells } } -//touch selection handlebars for the Popover.osd above -.cursor-handle { - background-color: transparent; - background-image: none; - &.top { -gtk-icon-source: -gtk-icontheme('selection-start-symbolic'); } - &.bottom { -gtk-icon-source: -gtk-icontheme('selection-end-symbolic'); } -} - /***************** * Notebooks and * * Tabs * @@ -2406,3 +2398,81 @@ GtkColorSwatch { } } +/********************** + * Touch Copy & Paste * + *********************/ + +//touch selection handlebars for the Popover.osd above +.entry.cursor-handle, +.cursor-handle { + background-color: $bg_color; + background-image: none; + -gtk-icon-source: none; + box-shadow: none; + outline-style: none; + outline-color: transparent; + border: 2px solid $fg_color; + @each $s,$as in ('',''), + (':hover','-hover'), + (':active','-active') { //no need for insensitive and backdrop + &.top#{$s}:dir(ltr), &.bottom#{$s}:dir(rtl) { + border-radius: 10px 0 0 0; + padding-left: 10px; + } + &.bottom#{$s}:dir(ltr), &.top#{$s}:dir(rtl) { + border-radius: 0 10px 0 0; + padding-right: 10px; + } + &.insertion-cursor#{$s}:dir(ltr), &.insertion-cursor#{$s}:dir(rtl) { + border-radius: 10px 10px 0 0; + } + } +} + +/* Decouple the font of context menus from their entry/textview */ +.context-menu { + font: initial; +} + +.touch-selection { + font: initial; + color: $osd_fg_color; + border: none; + background-color: opacify($osd_bg_color,0.2); + background-clip: padding-box; + outline-color: transparentize($osd_fg_color, 0.7); + box-shadow: none; + text-shadow: 0 1px black; + icon-shadow: 0 1px black; + &:backdrop { text-shadow: none; } + .button { + @include button(osd); + &:hover { @include button(osd-hover); } + &:active, &:checked { @include button(osd-active); } + &:insensitive, &:backdrop:insensitive { @include button(osd-insensitive); } + &:backdrop { @include button(osd-backdrop); } + } + // checkboxes and radios to use the -dark style for OSD style popovers + @each $w,$a in ('check', 'checkbox'), + ('radio','radio') { + @each $s,$as in ('','-unchecked'), + (':hover', '-unchecked-hover'), + (':active', '-unchecked-active'), + (':insensitive','-unchecked-insensitive'), + (':inconsistent', '-mixed'), + (':inconsistent:hover', '-mixed-hover'), + (':inconsistent:selected', '-mixed-active'), + (':inconsistent:insensitive', '-mixed-insensitive'), + (':checked', '-checked'), + (':checked:insensitive','-checked-insensitive'), + (':checked:hover', '-checked-hover'), + (':checked:active', '-checked-active'), + (':backdrop:checked', '-checked-backdrop') { + .#{$w}#{$s} { + icon-shadow: none; + color: $osd_fg_color; + } + } + } +} + diff --git a/gtk/theme/HighContrast/gtk.css b/gtk/theme/HighContrast/gtk.css index b54a7113ea..e5093fd15a 100644 --- a/gtk/theme/HighContrast/gtk.css +++ b/gtk/theme/HighContrast/gtk.css @@ -1324,14 +1324,6 @@ GtkTreeView.view.progressbar { border-color: rgba(255, 255, 255, 0.2); color: #7f7f7f; } -.cursor-handle { - background-color: transparent; - background-image: none; } - .cursor-handle.top { - -gtk-icon-source: -gtk-icontheme("selection-start-symbolic"); } - .cursor-handle.bottom { - -gtk-icon-source: -gtk-icontheme("selection-end-symbolic"); } - /***************** * Notebooks and * * Tabs * @@ -2695,3 +2687,183 @@ GtkColorSwatch { icon-shadow: none; border-color: transparent; transition-property: border, box-shadow, color; } + +/********************** + * Touch Copy & Paste * + *********************/ +.entry.cursor-handle, +.cursor-handle { + background-color: #fff; + background-image: none; + -gtk-icon-source: none; + box-shadow: none; + outline-style: none; + outline-color: transparent; + border: 2px solid #000; } + .entry.cursor-handle.top:dir(ltr), .entry.cursor-handle.bottom:dir(rtl), + .cursor-handle.top:dir(ltr), + .cursor-handle.bottom:dir(rtl) { + border-radius: 10px 0 0 0; + padding-left: 10px; } + .entry.cursor-handle.bottom:dir(ltr), .entry.cursor-handle.top:dir(rtl), + .cursor-handle.bottom:dir(ltr), + .cursor-handle.top:dir(rtl) { + border-radius: 0 10px 0 0; + padding-right: 10px; } + .entry.cursor-handle.insertion-cursor:dir(ltr), .entry.cursor-handle.insertion-cursor:dir(rtl), + .cursor-handle.insertion-cursor:dir(ltr), + .cursor-handle.insertion-cursor:dir(rtl) { + border-radius: 10px 10px 0 0; } + .entry.cursor-handle.top:hover:dir(ltr), .entry.cursor-handle.bottom:hover:dir(rtl), + .cursor-handle.top:hover:dir(ltr), + .cursor-handle.bottom:hover:dir(rtl) { + border-radius: 10px 0 0 0; + padding-left: 10px; } + .entry.cursor-handle.bottom:hover:dir(ltr), .entry.cursor-handle.top:hover:dir(rtl), + .cursor-handle.bottom:hover:dir(ltr), + .cursor-handle.top:hover:dir(rtl) { + border-radius: 0 10px 0 0; + padding-right: 10px; } + .entry.cursor-handle.insertion-cursor:hover:dir(ltr), .entry.cursor-handle.insertion-cursor:hover:dir(rtl), + .cursor-handle.insertion-cursor:hover:dir(ltr), + .cursor-handle.insertion-cursor:hover:dir(rtl) { + border-radius: 10px 10px 0 0; } + .entry.cursor-handle.top:active:dir(ltr), .entry.cursor-handle.bottom:active:dir(rtl), + .cursor-handle.top:active:dir(ltr), + .cursor-handle.bottom:active:dir(rtl) { + border-radius: 10px 0 0 0; + padding-left: 10px; } + .entry.cursor-handle.bottom:active:dir(ltr), .entry.cursor-handle.top:active:dir(rtl), + .cursor-handle.bottom:active:dir(ltr), + .cursor-handle.top:active:dir(rtl) { + border-radius: 0 10px 0 0; + padding-right: 10px; } + .entry.cursor-handle.insertion-cursor:active:dir(ltr), .entry.cursor-handle.insertion-cursor:active:dir(rtl), + .cursor-handle.insertion-cursor:active:dir(ltr), + .cursor-handle.insertion-cursor:active:dir(rtl) { + border-radius: 10px 10px 0 0; } + +/* Decouple the font of context menus from their entry/textview */ +.context-menu { + font: initial; } + +.touch-selection { + font: initial; + color: #fff; + border: none; + background-color: black; + background-clip: padding-box; + outline-color: rgba(255, 255, 255, 0.3); + box-shadow: none; + text-shadow: 0 1px black; + icon-shadow: 0 1px black; } + .touch-selection:backdrop { + text-shadow: none; } + .touch-selection .button { + border-width: 2px; + border-style: solid; + color: #fff; + background-image: none; + background-color: rgba(0, 0, 0, 0.8); + border-color: rgba(255, 255, 255, 0.2); + box-shadow: none; } + .touch-selection .button:hover { + border-width: 2px; + border-style: solid; + color: #fff; + background-color: rgba(77, 77, 77, 0.8); + border-color: rgba(255, 255, 255, 0.2); + box-shadow: none; } + .touch-selection .button:active, .touch-selection .button:checked { + border-width: 2px; + border-style: solid; + color: rgba(0, 0, 0, 0.8); + background-color: #fff; + border-color: rgba(255, 255, 255, 0.2); + box-shadow: none; } + .touch-selection .button:insensitive, .touch-selection .button:backdrop:insensitive { + border-width: 2px; + border-style: solid; + border-color: rgba(255, 255, 255, 0.2); + color: #7f7f7f; } + .touch-selection .button:backdrop { + border-width: 2px; + border-style: solid; } + .touch-selection .check { + icon-shadow: none; + color: #fff; } + .touch-selection .check:hover { + icon-shadow: none; + color: #fff; } + .touch-selection .check:active { + icon-shadow: none; + color: #fff; } + .touch-selection .check:insensitive { + icon-shadow: none; + color: #fff; } + .touch-selection .check:inconsistent { + icon-shadow: none; + color: #fff; } + .touch-selection .check:inconsistent:hover { + icon-shadow: none; + color: #fff; } + .touch-selection .check:inconsistent:selected { + icon-shadow: none; + color: #fff; } + .touch-selection .check:inconsistent:insensitive { + icon-shadow: none; + color: #fff; } + .touch-selection .check:checked { + icon-shadow: none; + color: #fff; } + .touch-selection .check:checked:insensitive { + icon-shadow: none; + color: #fff; } + .touch-selection .check:checked:hover { + icon-shadow: none; + color: #fff; } + .touch-selection .check:checked:active { + icon-shadow: none; + color: #fff; } + .touch-selection .check:backdrop:checked { + icon-shadow: none; + color: #fff; } + .touch-selection .radio { + icon-shadow: none; + color: #fff; } + .touch-selection .radio:hover { + icon-shadow: none; + color: #fff; } + .touch-selection .radio:active { + icon-shadow: none; + color: #fff; } + .touch-selection .radio:insensitive { + icon-shadow: none; + color: #fff; } + .touch-selection .radio:inconsistent { + icon-shadow: none; + color: #fff; } + .touch-selection .radio:inconsistent:hover { + icon-shadow: none; + color: #fff; } + .touch-selection .radio:inconsistent:selected { + icon-shadow: none; + color: #fff; } + .touch-selection .radio:inconsistent:insensitive { + icon-shadow: none; + color: #fff; } + .touch-selection .radio:checked { + icon-shadow: none; + color: #fff; } + .touch-selection .radio:checked:insensitive { + icon-shadow: none; + color: #fff; } + .touch-selection .radio:checked:hover { + icon-shadow: none; + color: #fff; } + .touch-selection .radio:checked:active { + icon-shadow: none; + color: #fff; } + .touch-selection .radio:backdrop:checked { + icon-shadow: none; + color: #fff; } -- 2.30.2